<!doctype html>
<head>
	<meta charset="utf-8">
	<title>ES 搜索</title>
	<meta name="renderer" content="webkit">
	<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
	<meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=0">

	<link rel="stylesheet" href="css/esIndex.css" media="all">
	<link rel="stylesheet" href="../layui/css/layui.css" media="all">
	<link rel="icon" href="img/es_icon.jpg" type="image/x-icon"/>
</head>

<body>
<div class="layui-fluid" align="center" style="width: 90%">
	<div class="layui-row layui-col-space15">
		<div class="layui-col-md12 data_loc">
			<img class="icon" src="img/es.jpg"><br/>
			<div class="layui-card search">
				<input class="layui-input-inline search_input" id="keyword" placeholder="请输入关键词"/>
				<input class="layui-btn" type="button" value=" 搜 索 一 下 "/>
			</div>
			<div class="layui-row">
				<div class="filter_div" hidden>
					<label>搜索维度&nbsp;&nbsp;</label>
					<span><input type="radio" name="field" id="content" checked>内容&nbsp;&nbsp;</span>
					<span><input type="radio" name="field" id="author">负责人</span>
					<span><input type="radio" name="field" id="company">合作单位&nbsp;&nbsp;</span>
				</div>
				<div class="nums_text" hidden>ES为您找到相关结果共<span id="resultNum"></span>个</div>
				<div class="layui-card-body" id="dataBody"></div>
			</div>
			<div id="pageFooter" class="layout-footer"></div>
		</div>
	</div>
</div>

<script src="../layui/layui.js" charset="UTF-8"></script>
<!--<script>-->
<!--	layui.config({-->
<!--		base: '../src/' //指定项目路径-->
<!--		// ,version: '1.2.2'-->
<!--		// ,version:  new Date().getTime()-->
<!--	}).use('index');-->
<!--</script>-->
<script type="text/javascript">
	layui.define(['element','laypage','layer'],function(){
		var $ = layui.jquery
				,layPage = layui.laypage
				,layer = layui.layer
				,total = 0
				,limit = 10
				,currDatas = '';
		const table_URL = 'http://localhost/es/query_hit_page';

		$("[type=radio]").on('click',function () {
			$(".layui-btn").click();
		});
		$("#keyword").keydown(function (e) {
			if (e.keyCode === 13) {
				$(".layui-btn").click();
			}
		});

		$(".layui-btn").on('click',function () {
			var keyword = $("#keyword").val();
			if (keyword === ''){
				layer.msg('请输入关键词');
				return;
			}
			$(".nums_text").show();
			$(".filter_div").show();

			var content = $("#content").is(":checked");
			var author = $("#author").is(":checked");
			var company = $("#company").is(":checked");
			var type = "content";
			if (author){
				type = "author";
			} else if (company) {
				type = "company";
			}
			$.ajax({
				url: table_URL,
				type:'get',
				data: {pageNo:1,pageSize:limit,type:type,keyword:keyword},
				contentType : 'application/json;charset=UTF-8',
				success:function(res){
					// console.log(res);
					if (res.totalCount !== undefined){
						total = res.totalCount;
					}
					$("#dataBody").empty();
					$("#resultNum").text(total);
					makeDiv(res.list);
					currDatas = res.list;

					layPage.render({
						elem: 'pageFooter'
						,count: total
						,limit: limit
						,first: '首页'
						,last: '尾页'
						,layout: ['prev', 'page', 'next', 'refresh', 'skip']
						,jump: function(obj, first){
							// console.log(obj);
							if (first) return;
							$.ajax({
								url:table_URL,
								type:'get',
								data: {pageNo:obj.curr,pageSize:limit,type:type,keyword:keyword},
								contentType : 'application/json;charset=UTF-8',
								success:function(res){
									// console.log(res.data.records);
									if (res.totalCount !== undefined){
										total = res.totalCount;
									}
									$("#dataBody").empty();
									$("#resultNum").text(total);
									makeDiv(res.list);
									currDatas = res.list;
								}
							});
						}
					});
				}
			});
		});

		function makeDiv(datas) {
			for (var i=0;i<datas.length;i++) {
				$("#dataBody").append('<div class="layui-card box_div" align="left">\n' +
						'<div class="data_title"><a class="data_title_a" id="'+i+'" onclick="openDetail(this)">' + datas[i].title + '</a></div>\n' +
						'<div class="data_intro">' + datas[i].highlight + '</div>');
			}
		}

		window.openDetail = function (title) {
			layer.open({
				type: 1,
				title: '查看详情',
				area: ['65%', '80%'],
				offset: '13%',
				closeBtn: 1,
				shadeClose: true,
				maxmin: true,
				moveOut: true,
				scrollbar: true,
				skin: 'layui-layer-molv',
				content: '<div class="layui-fluid" style="width: 80%">\n' +
						'\t<div class="layui-row">\n' +
						'\t\t<div class="layui-card" align="center">\n' +
						'\t\t\t<span class="detail_title">'+title.innerHTML+'</span><hr>\n' +
						'\t\t</div>\n' +
						'\t\t<div class="layui-card-body" style="text-indent:24.0000pt;">'+currDatas[title.id].content+'</div>\n' +
						'\t</div>\n' +
						'</div>',
				success: function(layero){
					layero.find('.layui-layer-min').remove();
				}
			});
		};

	});
</script>
</body>
</html>














